import React, { PureComponent } from 'react';
import {
  View,
  Text,
  StyleSheet,
  TouchableNativeFeedback,
} from 'react-native';

class PositionItem extends PureComponent {
  constructor(props) {
    super(props);
    this.state = {};
  }

  onSelect = () => {
    console.log('select evt visit');
    if (this.props.onSelect) {
      this.props.onSelect();
    }
  }

  render() {
    return (
      <View style={styles.container}>
        <Text style={styles.left}>
          asdfjkasdfjk@lkasdjklasdkjf2@jkasdjafsdjf 主板
        </Text>
        <TouchableNativeFeedback onPress={this.onSelect}>
          <View style={styles.touchArea}>
            <Text style={styles.right}>选择</Text>
          </View>
        </TouchableNativeFeedback>
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    display: 'flex',
    flexDirection: 'row',
    alignItems: 'center',
  },
  left: {
    flex: 1,
    color: '#ffffff',
  },
  touchArea: {
    borderWidth: 1,
    borderStyle: 'solid',
    borderColor: '#ffffff',
    padding: 4,
    borderRadius: 5,
    marginRight: 5,
  },
  right: {
    width: 80,
    textAlign: 'center',
    color: '#ffffff',
  },
});

export default PositionItem;
